<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/task_message.css" />
    <script src="js/jquery-2.1.1.min.js"></script>
    <title></title>
    <script type="text/javascript">
    	function orderTask(){
    		$.ajax({
    			url:"TaskOperationServlet",
    			data:{
    				operation:'orderTask',
    				id:getId()
    			},
    			success:function(message){
    				alert(message);
    				location="index.html";
    			}
    		})
    	}
        // 获取url中的id
    	function getId(){
    		return window.location.href.split("?")[1].split("=")[1];
    	}
        // 获取任务信息
    	$.getJSON("TaskOperationServlet",{operation:'getById', id:getId()},function(task){
            task = task['list'][0];
            $('#username').text(task.customer.username);
            $('#time').text(calculateTime(task.time));
            $('#message').html(task.message);
            $('#addr').text(task.address);
            $('#money').text(task.money);
            $('#status').text(task.status);
        })
        // 计算时间差
		function calculateTime(startTime){
			var date1= startTime;  //开始时间  
		    var date2 = new Date();    //结束时间  
		    var date3 = date2.getTime() - new Date(date1).getTime();   //时间差的毫秒数 
		    
		    //计算出相差天数  
		    var days=Math.floor(date3/(24*3600*1000))
		  
		    //计算出小时数  
		    var leave1=date3%(24*3600*1000)    //计算天数后剩余的毫秒数  
		    var hours=Math.floor(leave1/(3600*1000))  
		    
		    //计算相差分钟数  
		    var leave2=leave1%(3600*1000)        //计算小时数后剩余的毫秒数  
		    var minutes=Math.floor(leave2/(60*1000))  
		    
		    var str = "刚刚"
		    if (days > 1){
		    	str = days + "天前"
		    }else if (hours > 1){
		    	str = hours + "小时前"
		    }else if(minutes > 1){
		    	str = minutes + "分钟前"
		    }
		    return str;
		}
    </script>
</head>
<body>
<div class="mytask">
    <div class="spanleft fl" onclick="location='index.html'"> < </div>
    <div class="spanright fl">任务详情页</div>
    <div class="clear"></div>
</div>

<div class="personinfo">
    <div class="fl personleft"><img src="image/man.png" style="margin-top:25px;"/></div>
    <div class="fl personmiddle" id="username"></div>
    <div class="fl personright" id="time"></div>
    <div class="clear"></div>
</div>

<div class="task_info" id="message"></div>
<div class="fill"></div>

<div class="address">
    <div class="fl"><img src="image/pic1.png" style="margin-top:10px;"/></div>
    <div class="fl address_bottom" id="addr"> </div>
</div>

<!-- <div class="beizhu">
    <div class="fl"><img src="image/pic2.png" style="margin-top:10px;"/>  </div>
    <div class="fl beizhu_bottom" id="">备注：送到宿舍 </div>
</div> -->


<div class="money">
    <div class="fl"><img src="image/pic3.png" style="margin-top:10px;"/> </div>
    <div class="fl money_bottom">已在线支付报酬：<span id="money"></span> 元</div>
</div>


<div class="state">

    <div class="fl state_top">任务状态：</div>
    <div class="fl state_bottom" id="status"></div>
</div>

<div class="footer">
    <div class="submit" onclick="orderTask()"> 我要接单</div>
</div>

</div>

</body>
</html>